<Html>
    <head>
        <title>
            easycom
        </title>
    </head>
    <body>
        <script>
            
                    /*
                        九、easycom
                                
                                <1> 概述：

                                            传统 Vue 组件，需要安装、引用、注册，三个步骤后才能使用组件。

                                            easycom将其精简为一步。

                                            只要组件路径符合规范(具体见下)，就可以不用引用、注册， 直接在页面使用。

                                            eg:
                                                    <template>
                                                        <view class="container">
                                                            <comp-a></comp-a>
                                                            <uni-list>
                                                            </uni-list>
                                                        </view>
                                                    </template>
                                                    <script>
                                                        
                                                        // 这里不用import引入，也不需要在components内注册uni-list组件。template里就可以直接用
                                                        export default {
                                                            data() {
                                                                return {}
                                                            }
                                                        }
                                                    <//script>


                                <2>、路径规范：

                                            ①、 安装在项目根目录下的 components 目录下，并符合 " components/组件名/组件名.vue " 的路径规范。

                                            ②、 安装在 uni_modules 下，路径为 " uni_modules/插件ID、components/组件名/组件名。vue " 


                                                ★、工程目录：

                                                        ┌─components
                                                        │  └─comp-a
                                                        │    └─comp-a.vue      符合easycom规范的组件
                                                        |
                                                        └─uni_modules          [uni_module](/plugin/uni_modules.md)中符合easycom规范的组件
                                                        └─uni_modules
                                                            └─uni-list
                                                            └─components
                                                                └─uni-list
                                                                └─ uni-list.vue
                                                

                                                ★、不管components目录下安装了多少组件， easycom 打包会自动剔除没有使用的组件，对组件库的使用尤为友好。

                                                    组件库批量安装，随意使用，自动按需打包。
                                                    
                                                    以官方的uni-ui为例，在HBuilderX "新建项目界面"  选择 "uni-ui 项目模板"，只需要在页面中敲 "u",就可以拉出大量组件代码块，直接选择，即可使用。

                                                    这样大幅提高开发效率，降低使用门槛。

                                                    在uni-app插件市场下载符合components/组件名称/组件名称.vue目录结构的组件，均可直接使用。


                                <3>、自定义easycom配置的示例

                                            easycom是自动开启的，不需要手动开启，有需求时可以在 pages.json 的 easycom 节点进行个性化设置：如关闭自动扫描，或自定义扫描匹配组件的策略。

                                            设置参数如下：

                                        ★、属性列表：

                                                属性	        类型	        默认值	        描述

                                                autoscan	    Boolean	        true	    是否开启自动扫描，开启后将会自动扫描符合components/组件名称/组件名称.vue目录结构的组件

                                                custom	        Object	        -	        以正则方式自定义组件匹配规则。如果autoscan不能满足需求，可以使用custom自定义匹配规则


                                           如果你的组件，不符合easycom前述的路径规范。可以在pages.json的easycom节点中自行定义路径规范。


                                           如果需要匹配node_modules内的vue文件，需要使用packageName/path/to/vue-file-$1.vue形式的匹配规则，
                                           
                                           其中packageName为安装的包名，/path/to/vue-file-$1.vue为vue文件在包内的路径。

                                           eg:

                                                "easycom": {
                                                    "autoscan": true,
                                                    "custom": {
                                                        "^uni-(.*)": "@/components/uni-$1.vue", // 匹配components目录内的vue文件
                                                        "^vue-file-(.*)": "packageName/path/to/vue-file-$1.vue" // 匹配node_modules内的vue文件
                                                    }
                                                }

                                         ★、说明：

                                                ①、easycom方式引入的组件无需在页面内import，也不需要在components内声明，即可在任意页面使用。

                                                ②、easycom方式引入组件不是全局引入，而是局部引入。例如在H5端只有加载相应页面才会加载使用的组件。

                                                ③、在组件名完全一致的情况下，easycom引入的 "优先级低于手动引入"（区分连字符形式与驼峰形式）。

                                                ④、考虑到编译速度，直接在pages.json内修改easycom不会触发重新编译，需要改动页面内容触发。

                                                ⑤、easycom只处理vue组件，不处理小程序专用组件（如微信的wxml格式组件）。
                                                        
                                                    不处理后缀为.nvue的组件。
                                                    
                                                    因为nvue页面引入的组件也是.vue组件。
                                                    
                                                    可以参考uni ui，使用vue后缀，同时兼容nvue页面。

                                                ⑥、nvue页面里引用.vue后缀的组件，会按照nvue方式使用原生渲染，其中不支持的css会被忽略掉。这种情况同样支持easycom

                                                ⑦、vue 与 uvue 组件优先级，详见 ：https://doc.dcloud.net.cn/uni-app-x/component/#priority


                                         ★、Bug & Tips

                                                   HBuilderX 3.96 版本以下uni-app x项目，当页面文件名与easycom的组件名一样时，会渲染异常，可以通过调整页面文件名规避该Bug。 


                    */
        </script>
    </body>
</Html>